<!DOCTYPE HTML >
<html>
    <head>
        <title>把块级元素改为行级元素</title>
        <meta charset='utf-8'>
        <style type='text/css'>
            *{
                padding: 0;
                margin: 0;
            }
            .table{
                   border:0 none;
                   border-collapse: collapse;
                   line-height: 30px;
                   margin: 0 auto}
          .table  td {
               border: 1px solid #5b4bd9;
                width: 100px;
                height: 30px;
                font-size: 20px;
            }

            .div1{
                border-top: 1px solid #5b4bd9;
                border-left: 1px solid #5b4bd9;
                line-height: 30px;
                width: 606px;
                margin: 0 auto}
            .div1 div{  border-bottom:1px solid #5b4bd9;
                border-right:1px solid #5b4bd9;
                display: inline-block;
                width: 100px;
                font-size: 20px;
            }
            .div2{
                border-top: 1px solid #5b4bd9;
                border-left: 1px solid #5b4bd9;
                height:62px;
                line-height: 30px;
                width: 606px;
                margin: 0 auto}
            .div2 div{
                border-bottom:1px solid #5b4bd9;
                border-right:1px solid #5b4bd9;
               float:left;
                width: 100px;
                font-size: 20px;
            }
        </style>
    </head>
    <body>
    <table class='table' >
        <tr >
            <td >1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td>
        </tr>
        <tr>
            <td >1</td>
            <td>2</td>
            <td>3</td>
            <td>4</td>
            <td>5</td>
            <td>6</td>
        </tr>
    </table>


    <hr/>
    <div class='div1'>
        <div>1</div><div>2</div><div>3</div><div>4</div><div>5</div><div>6</div><div>1</div><div>2</div><div>3</div><div>4</div><div>5</div><div>6</div>
    </div>
    <hr/>
    <div class='div2'>
        <div>1</div>
        <div>2</div>
        <div>3</div>
        <div>4</div>
        <div>5</div>
        <div>6</div>
        <div>1</div><div>2</div><div>3</div><div>4</div><div>5</div>
        <div>6</div>
    </div>

    </body>
</html>